<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      * {
        padding: 0;
        margin: 0;
        list-style-type: none;
      }
      a{
          text-decoration: none;
      }

      .menu{
          width: 325px;
          margin: 30px auto;
          border-top: 1px solid #dddddd;
      }
      .title{
          display: inline-block;
          border-top: 1px solid #f34540;
          margin-top: -1px;
          padding-top: 11px;
          margin-bottom: 15px;
      }
      .title a{
          color: #0e0e1d;
          font-weight: bolder;
          font-size: 16px;
      }
      .img-nav img{
          width: 300px;
      }

      .img-title {
          margin-left: 30px;
          margin-top: -33px;
          margin-bottom: 30px;
      }

      .img-title a{
          color: #fff;
          margin-top: -20px;
          font-weight: bolder;
      }
      .news-list{
          margin-left: 15px;
      }

      .news-list  li {
          margin-bottom: 9px;
      }
      .news-list  li a{
          color:#666666 ;
          font-size: 14px;
      }

    </style>
  </head>
  <body>
    <div class="menu">
      <div class="title">
        <a href="#">体育</a>
      </div>
      <div class="img-nav">
        <a href="#">
          <img src="./1/img/1.jpeg" alt="" />
        </a>
        <div class="img-title">
            <a href="#">
                费德勒首负迪米 扶额摇头不满发挥
            </a>
        </div>
      </div>
      <ul class="news-list">
          <li><a href="#">乔治：我爱LA喜欢和LBJ一起打球</a></li>
          <li><a href="#">格林：3年前降薪就在等KD特制T嘲讽LBJ</a></li>
          <li><a href="#">塔克4000双鞋让保罗羡慕嫉妒乔丹被震惊</a></li>
          <li><a href="#">CBA下季新赛制：常规赛4组循环增至46轮</a></li>
      </ul>
    </div>
  </body>
</html>
